@charset "utf-8";
/* CSS Document*/
body {
    line-height:1.6;
    font-family:"Lantinghei SC","Helvetica Neue","Helvetica","STHeitiSC-Light","Hiragino Sans GB","Microsoft YaHei","Arial",sans-serif;
    color:#222;
    font-size:15px;
}
body,h1,h2,h3,h4,p,ul,ol,dl,dd,fieldset,textarea {
    margin:0;
}
fieldset,legend,textarea {
    padding:0;
}
ul,ol {
    padding-left:0;
    list-style-type:none
}
a img,fieldset {
    border:0;
}
a {
    color:#607fa6;
}
a,a:hover,a.visited {
    text-decoration:none;
}
input,select,a,textarea,form,lable {
    -webkit-appearance:none;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
h1{
    text-align:center;
    font-size:16px;
    color:#b2b2b2;
    font-weight:normal;
    padding:0 0 10px 0px;
    }
body {
    background-color:#efeff4
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
  src: local('Ubuntu'), url(http://fontstatic.useso.com/s/ubuntu/v7/_xyN3apAT_yRRDeqB3sPRg.woff) format('woff');
}
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
  src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url(http://fontstatic.useso.com/s/ubuntu/v7/0ihfXUL2emPh0ROJezvraD8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

.mask {
    width:100%;
    height:100%;
    position:fixed;
    left:0;
    top:0;
    background-color:rgba(0,0,0,0.5);
    z-index:1;
}
.wrp_tips_pop {
    position:fixed;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background-color:rgba(0,0,0,0.5);
}

.none {
    display:none;
}
.cell_r {
    float:right;
    padding-right:20px;
}
.page_index {
    min-height:100%;
    background-color:#fff;
}
.menu_list:before {
    top:-1px;
}
.profile_hd {
    text-align:center;
    position:relative;
    padding:35px 0 0 0;
    color:#888;
    background-color:#f3f3f3;
}
.profile_hd .inner {
    position:relative;
    z-index:2;
}
.profile_hd .profile_logo {
    width:100px;
    height:100px;
    border-radius:100%;
    -moz-border-radius:100%;
    -webkit-border-radius:100%;
    border:2px solid rgba(255,255,255,0.8);
    vertical-align:middle;
}
.profile_hd .profile_extra {
    line-height:1em;
    font-size:14px
}
.profile_hd .profile_name {
    font-size:20px;
    margin-top:10px;
    color:#000;
}

.ios_skin .profile_hd {
    color:#fff;
}
.profile_hd .btn_exit {
    position:absolute;
    right:15px;
    top:-10px;
    background-color:#fafafc;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    width:46px;
    text-align:center;
    color:#5d5d5d;
    border:1px solid #dfdfdf;
}
.data_overview {
    padding:25px 0 30px;
    font-size:14px;
}
.data_overview .overview_list {
    display:-webkit-box;
}
.data_overview .overview_item {
    -webkit-box-flex:1;
    width:50%;
}
.data_overview .overview_item .number {
    font-size:35px;
    color:#000;
    line-height:30px;
}
.data_overview .overview_item .desc {
    color:#949494;
}
.ios_skin .data_overview .overview_item .desc {
    color:#fff;
}
.data_overview .overview_item .desc.r_line {
    position:relative;
}
.data_overview .overview_item .desc.r_line:after {
    position:absolute;
    content:'';
    right:0;
    top:-12px;
    height:60px;
    width:1px;
    border-right:1px solid #dfdfdf;
    -webkit-transform-origin:0 100%;
    transform-origin:0 100%;
    -webkit-transform:scaleY(0.5);
    transform:scaleY(0.5);
}
.data_overview .overview_item:first-child .number {
    color:#0bba07;
}
.data_overview .overview_item:first-child .number.no_new {
    color:#000;
}

.profile_fun .fun_tit {
    font-size:16px;
    padding:15px;
}
.menu_list:after {
    display: none;
}

.menu_list .menu_item {
    position: relative;
}

.menu_list .menu_item:after {
    position: absolute;
    content: '';
    right: 0;
    top: 0;
    height: 100%;
    width: 1px;
    border-right: 1px solid #dfdfdf;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleX(0.5);
    transform: scaleX(0.5);
}

.menu_list .menu_item:before {
    position: absolute;
    content: '';
    left: -1px;
    bottom: 0;
    height: 1px;
    width: 100%;
    border-bottom: 1px solid #dfdfdf;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.menu_list .menu_item .inner_item {
    padding: 30px 0 20px 0;
}

.menu_list .menu_item:nth-child(3n):after {
    display: none
}

.ft_menu {
    padding-bottom: 5px;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding-top: 10px;
    background-color: #fff;
    position: fixed;
}

.menu_list {
    position: relative;
    overflow: hidden;
}

.menu_list:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #dfdfdf;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.menu_list:before {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    border-top: 1px solid #dfdfdf;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5);
}

.menu_list .menu_item {
    float: left;
    text-align: center;
    width: 33.3%;
}

.menu_list .menu_item .inner_item {
    display: block;
    color: #000;
    padding: 20px 0 18px;
}

.menu_list .menu_item .icon_menu {
    display: inline-block;
    position: relative;
    width: 23px;
    height: 30px;
}

.menu_list .menu_item .icon_menu:after {
    position: absolute;
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    left: 50%;
    top: 50%;
}


.menu_list .menu_item.fans_record .icon_menu:after {
    width: 30px;
    height: 30px;
    background: url("../images/menulist.png") 0 0 no-repeat;
    -webkit-background-size: 35px 171px;
    background-size: 35px 171px;
    margin-top: -20px;
    margin-left: -15px
}

.menu_list .menu_item.swap_record .icon_menu:after {
    width: 30px;
    height: 30px;
    background: url("../images/menulist.png") 0 -64px no-repeat;
    -webkit-background-size: 35px 171px;
    background-size: 35px 171px;
    -webkit-background-position: 0 -32px;
    background-position: 0 -32px;
    margin-top: -20px;
    margin-left: -13px;
}

.menu_list .menu_item.rank_record .icon_menu:after {
    width: 30px;
    height: 30px;
    background: url("../images/menulist.png") 0 -131px no-repeat;
    -webkit-background-size: 35px 171px;
    background-size: 35px 171px;
    -webkit-background-position: 0 -64px;
    background-position: 0 -64px;
    margin-top: -20px;
    margin-left: -13px;
}

/* Rank CSS */

#rankpage{
  position: relative;
  width: 100%;
  /*max-width: 1170px;*/
  font-size: 14px;
  font-size: 0.875rem;
  margin-top:40px;
    }
#ranking {
    /*width: 90%;*/
    left: 5%;
    top: 10%;
    background-color: #fff;
    border-radius: 5px;
    padding: 30px 15px;
}
#ranking_list {
    display: block;
    width: 100%;
    /*height: 100%;*/
    overflow: hidden;
    overflow-y:auto;
}

#ranking_list::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
 background-color: #F5F5F5;
 border-radius: 10px;
}
 #ranking_list::-webkit-scrollbar {
 width: 5px;
 background-color: #F5F5F5;
}
 #ranking_list::-webkit-scrollbar-thumb {
 border-radius: 10px;
 background-image: -webkit-gradient(linear,  left bottom,  left top,  color-stop(0.44, rgb(122,153,217)),  color-stop(0.72, rgb(73,125,189)),  color-stop(0.86, rgb(28,58,148)));
}

#ranking_title, #play_game, #return_back {
    display: block;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    border-radius: 20px;
    position: absolute;
}
#ranking_title {
    width: 50%;
    left: 25%;
    top: -21px;
    background-color: #f9820d;
}

.box {
    width: 100%;
    background-color: #fffaef;
    height: 50px;
    line-height: 50px;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    border-radius: 10px;
    margin:5px auto 5px;
}
.cur{background-color: #dd5964;}
.col_1 {
    width: 50px;
    text-align: center;
    font-size:20px;
    color:#f9820d;
    background-repeat:no-repeat; background-position:center center; background-size:40px 40px;
}

.col_1[title="1"]{ color:#fff; background-image:url("../images/r1.png"); line-height:38px;}
.col_1[title="2"]{ color:#fff; background-image:url("../images/r2.png"); line-height:38px;}
.col_1[title="3"]{ color:#fff;  background-image:url("../images/r3.png");line-height:38px;}
.col_2 {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    padding: 5px 0;
    text-align:center;
}
.col_2 img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}
.col_3 {
    width:35%;
    color:#f9820d;
    font-size:14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-align:left;
}
.col_4 {
    width:25%;
    text-align:center;
    color:#f9500d;
    font-size:14px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.cur section{color: #fff;}

/* Shop Rows */

/* --------------------------------

Cart button

-------------------------------- */
.cd-cart {
  position: absolute;
  z-index: 2;
  top: 24px;
  right: 10px;
  height: 50px;
  width: 50px;
  background: url(../img/cd-icon-cart.svg) no-repeat center center;
}
.cd-cart span {
  /* number of items added to the cart */
  position: absolute;
  top: 2px;
  right: 5px;
  height: 18px;
  width: 18px;
  line-height: 18px;
  background-color: #46b29d;
  color: #ffffff;
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
  border-radius: 50%;
  /* scale it down if no products have been added to the cart */
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transition: -webkit-transform 0.2s 0s;
  -moz-transition: -moz-transform 0.2s 0s;
  transition: transform 0.2s 0s;
}
.cd-cart.items-added span {
  /* counter visible when a product is added to the cart */
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
@media only screen and (min-width: 1100px) {
  .cd-cart {
    position: fixed;
    top: 30px;
    right: 30px;
  }
}

/* --------------------------------

Gallery grid

-------------------------------- */
.cd-gallery {
  width: 90%;
  max-width: 1100px;
  margin: 1.5em auto;
}
.cd-gallery > li {
  margin-bottom: 2em;
  background:#ffffff;
  border-radius: 5px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}
@media only screen and (min-width: 768px) {
  .cd-gallery {
    margin-top: 2em;
  }
  .cd-gallery::after {
    clear: both;
    content: "";
    display: table;
  }
  .cd-gallery > li {
    width: 48%;
    float: left;
    margin: 0 4% 6% 0;
  }
  .cd-gallery > li:nth-of-type(2n) {
    margin-right: 0;
  }
}
@media only screen and (min-width: 1100px) {
  .cd-gallery {
    margin-top: 2.5em;
  }
  .cd-gallery > li {
    width: 30%;
    float: left;
    margin: 0 5% 5% 0;
  }
  .cd-gallery > li:nth-of-type(2n) {
    margin-right: 5%;
  }
  .cd-gallery > li:nth-of-type(3n) {
    margin-right: 0;
  }
}

/* --------------------------------

Single Item

-------------------------------- */
.cd-single-item {
  position: relative;
}
.cd-single-item > a {
  display: block;
  background-color: #ffffff;

}
.no-touch .cd-single-item:hover .cd-customization, .cd-single-item.hover .cd-customization {
  /* product customization visible */
  pointer-events: auto;
  -webkit-transition: opacity 0.2s 0s, visiblity 0s 0s;
  -moz-transition: opacity 0.2s 0s, visiblity 0s 0s;
}
.no-touch .cd-single-item:hover .cd-customization-trigger, .cd-single-item.hover .cd-customization-trigger {
  /* this is the settings icon - visible on touch devices only */
  display: none;
}

/* --------------------------------

Product Slider

-------------------------------- */
.cd-slider-wrapper {
  position: relative;
  overflow: hidden;
}
.cd-slider-wrapper li {
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /* by default, move the product image on the right*/
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: -webkit-transform 0.3s 0s, visibility 0s 0.3s;
  -moz-transition: -moz-transform 0.3s 0s, visibility 0s 0.3s;
  transition: transform 0.3s 0s, visibility 0s 0.3s;
}
.cd-slider-wrapper li.selected {
  /* this is the visible product image */
  position: relative;
  visibility: visible;
  z-index: 1;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: -webkit-transform 0.3s 0s, visibility 0s 0s;
  -moz-transition: -moz-transform 0.3s 0s, visibility 0s 0s;
  transition: transform 0.3s 0s, visibility 0s 0s;
}
.cd-slider-wrapper li.move-left {
  /* move the product image on the left */
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  transform: translateX(-100%);
}
.cd-slider-wrapper img {
  width: 100%;
  display: block;
  border-radius: 4px;
}
.order-info{
    marign:5px auto;
    font-size:12px;
    color:#5F5F5F;

    }
.order-info li{
    border-bottom:1px solid #e6e7f1;
    margin:-1px auto;
    height:28px;
    line-height:28px;
    padding:0 0 0 5px;
    float:left;
    }
.left{width:55%;}
.right{width:40%;}
/* --------------------------------

Product Customization

-------------------------------- */
.cd-customization {
display: box;
display: -webkit-box;
display: -moz-box;
width:100%;
/*height: 60px; */
border-radius: 5px;
background:#ffffff;
-webkit-box-pack:center;
-moz-box-pack:center;
-webkit-box-align:center;
-moz-box-align:center;
}
.cd-customization .add-to-cart {
  background:#dd5964;
  color: #ffffff;
  min-width:120px;
  font-size:16px;
  height:35px;
  margin: 13px auto;
  border-radius: 5px;
  border:1px solid #df4552;
  line-height:34px;

}
.cd-customization .go-use {
  background:#90c96b;
  color: #ffffff;
  width:120px;
  font-size:16px;
  height:35px;
  margin: 13px auto;
  border-radius: 5px;
  border:1px solid #78b551;
  line-height:34px;

}
.no-touch .cd-customization .add-to-cart:hover {
  background-color: #55bca8;
}

/* --------------------------------

Product Info (title + price)

-------------------------------- */
.cd-item-info {
  padding: 1em .5em .5em;
  color: #314d5d;
  font-weight: bold;
  line-height:30px;
  border-bottom:1px solid #f4f4f4;
}
.product-info{
font-size:14px;
color:#333333;
padding:1em 1em 1em 1em;
border-bottom:1px solid #f4f4f4;
    }
.cd-item-info::after {
  clear: both;
  content: "";
  display: table;
}
.cd-item-info b {
  float: left;
}
.cd-item-info em {
  float: right;
  color: #5484a0;
  font-style: normal;
}
.cd-item-info a {
  color: #314d5d;
}
.cd-item-info a:hover {
  text-decoration: underline;
}

#copyright {
    text-align: center;
    font-size: 12px;
    color: #999;
    margin: 1em auto;
}

div.wrp {
    max-width: 1280px;
    margin: 0 auto;
}
